<template>
  <div>
    <el-input v-model="showName" readonly placeholder="销售大区" class="search-input">
      <i slot="suffix" class="el-input__icon el-icon-circle-plus" @click="openDia"/>
      <i slot="suffix" class="el-input__icon el-icon-error" @click="changeDE"/>
    </el-input>
    <el-dialog v-dialogDrag :modal="false" :visible.sync="dialogVisible1" title="销售大区选择" custom-class="r-dialog" width="60%">
      <!-- 用户列表 -->
      <BaseTable ref="table" @chaneg-size="changeSizeHandle" @chaneg-page="changePageHandle" @current-change="handleSelectionChange">
        <el-table-column :show-overflow-tooltip="true" prop="PARENT_ORG_NAME" label="上级部门" min-width="150"/>
        <el-table-column prop="ORG_CODE" label="部门代码" min-width="100"/>
        <el-table-column :show-overflow-tooltip="true" prop="ORG_NAME" label="部门名称" min-width="100"/>
        <el-table-column :formatter="filterCode" prop="STATUS" label="状态" min-width="100" type="1001"/>
      </BaseTable>
      <div slot="footer" class="dialog-footer" style="text-align: center" >
        <el-button type="text"><i class="el-icon-search magnifier"/></el-button>
        <el-button type="primary" @click="confirmHandle" >确 定</el-button>
        <el-button @click="dialogVisible1 = false">取 消</el-button>

      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getComOrgList
  // getComOrgTreeList,
  // saveComOrgList,
  // editSaveComOrgList
} from '@/api/admin/org/gms/companyOrgManage'
import BaseTable from '@/components/BaseTable'
import formMixins from '@/mixins/formMixins'
import filtercode from '@/components/Checkbox/filtercode'
import companyOrgSelect from './companyOrgSelect'
import rSelect from '@/components/Select/Select'
import _ from 'lodash'
import {
  mapGetters
} from 'vuex'

export default {
  name: 'Ssss',
  components: {
    BaseTable,
    filtercode,
    companyOrgSelect,
    rSelect
  },
  mixins: [formMixins],
  props: {
    type: Number,
    salesAreaName: String
  },
  data() {
    return {
      load: false,
      dialogVisible1: false,
      showName: this.$props.salesAreaName,
      params: {},
      search: {
        limit: 10,
        pageNum: 1,
        busiType: this.$props.type
      }
    }
  },
  // userInfo用户信息systemParam系统参数
  computed: {
    ...mapGetters(['userInfo', 'systemParam'])
  },
  mounted() {},
  methods: {
    openDia() {
      this.dialogVisible1 = true
      this.$nextTick(() => {
        this.searchHandle()
      })
    },
    // 清除数据
    changeDE() {
      this.showName = ''
    },
    // 查询
    searchHandle() {
      const table = this.$refs['table']
      const search = _.extend(this.search)
      getComOrgList(search).then(res => {
        table.complete().filData(res)
      }).catch(err => {
        table.complete()
      })
    },
    handleSelectionChange(val) {
      if (val != null) {
        this.params = val
      }
    },
    confirmHandle() {
      this.dialogVisible1 = false
      this.showName = this.params.ORG_NAME
      if (this.$props.type === 16601001) {
        this.$emit('getSalesArea', this.params)
      } else {
        this.$emit('getAftersaleAreaName', this.params)
      }
    }
  }
}

</script>

<style scoped>
.magnifier {
  float: right;
  position: absolute;
  right: 50px;
  top: 23px;
  cursor: pointer;
}
</style>
